<script>
import { getAction } from '@api/manage'

export default {
  name: 'SelectStorageLocation',
  props: {
    value: {
      type: [String, Number],
      default: ''
    },
    warehouseCode: {
      type: String,
      default: null
    },
    excludeLocationCode: {
      type: String,
      default: null
    },
    placeholder: {
      type: String,
      default: '请选择储位'
    }
  },
  data() {
    return {
      list: [],
      url: {
        storageLocation: {
          list: '/wms/basic/warehouse/listStorageLocation'
        }
      }
    }
  },
  watch: {
    warehouseCode: {
      immediate: true,
      handler() {
        if (!this.warehouseCode) {
          return
        }
        this.fetchData()
      }
    }
  },
  computed: {
    getValueSting() {
      // update-begin author:wangshuai date:20200601 for: 不显示placeholder的文字 ------
      // 当有null或“” placeholder不显示
      return this.value != null ? this.value.toString() : undefined
      // update-end author:wangshuai date:20200601 for: 不显示placeholder的文字 ------
    }
  },
  mounted() {
    if (!this.warehouseCode) {
      return
    }
    this.fetchData()
  },
  methods: {
    fetchData() {
      getAction(this.url.storageLocation.list, {
        warehouseCode: this.warehouseCode,
        excludeLocationCode: this.excludeLocationCode
      }).then(res => {
        let { result } = res
        if (result) {
          this.list = result
        }
      })
    },
    handleInput(e = '') {
      let val
      if (Object.keys(e).includes('target')) {
        val = e.target.value
      } else {
        val = e
      }
      this.$emit('change', val)
      //LOWCOD-2146 【菜单】数据规则，选择自定义SQL 规则值无法输入空格
      this.$emit('input', val)
    }
  },
  model: {
    prop: 'value',
    event: 'change'
  }
}
</script>

<template>
  <a-select
    :placeholder="placeholder"
    :value="getValueSting"
    @change="handleInput"
    style="width: 100%">
    <a-select-option
      v-for="(item, index) in list"
      :key="index+new Date().getTime()"
      :value="item.locationCode">
      {{ item.locationName }}
    </a-select-option>
  </a-select>
</template>

<style scoped>

</style>